<template>
	<div>
		<van-row style="width: 100%;height: 7vh;border-bottom: 1px solid #f3f3f3;">
			<van-col span="3" style="height: 7vh;">
				<van-icon name="search" style="margin-top: 33%;" />
			</van-col>
			<van-col span="18" style="height: 7vh;">
				<van-tabs v-model="active">
					<van-tab title="推荐">
						<div style="width: 100vw;margin-left: -15vw;">
							<van-tabs >
								<van-tab @click="bbb(index)" v-for="(item,index) in forummenu" :key="index" :title="item.name" >
									<div style="width: 100%;height: 250px;display: flex;flex-wrap: wrap;">
										<div
											style="width: 45%;height: 250px;border: 1px solid #ccc;margin-left: 4%;margin-top: 3%;" v-for="items in menu">
											{{items}}
										</div>
										<div
											style="width: 45%;height: 250px;border: 1px solid #ccc;margin-left: 4%;margin-top: 3%;" v-for="items in menu">
											
										</div>
										<div
											style="width: 45%;height: 250px;border: 1px solid #ccc;margin-left: 4%;margin-top: 3%;" v-for="items in menu">
											
										</div>
									</div>
								</van-tab>
							</van-tabs>
						</div>
					</van-tab>
					<van-tab title="关注">内容 2</van-tab>
				</van-tabs>
			</van-col>
			<van-col span="3" style="height: 7vh;">
				<van-icon name="guide-o" style="margin-top: 33%;" />
			</van-col>
		</van-row>
		<HeadFoot :userName="userName" :userstate="userstate"></HeadFoot>
	</div>
</template>

<script>
	import HeadFoot from '../../components/headpage/HeadFoot.vue'
	export default {
		components: {
			HeadFoot
		},
		data() {
			return {
				userName: 1,
				userstate: true,
				active: 0,
			 forummenu: [{
				 id:1,
					name: '全部'
				}, {
					id:2,
					name: 'Mac'
				}, {
					id:3,
					name: 'iPhone'
				}, {
					id:4,
					name: 'iPad'
				}, {
					id:6,
					name: 'Apple Watch'
				}, {
					id:7,
					name: 'Music'
				}, {
					id:8,
					name: '配件'
				}],
			 menu:[],
			 menus:['4','5','6'],
			 menuss:['2','3','36']
			}
		},
        methods:{
			bbb(index){
				console.log(index)
				// if(index==1){
				// 	this.menu=this.menus
				// }else if(index==2){
				// 	this.menu=this.menuss
				// }
			}
		} 
	}
</script>

<style>
</style>
